import axios, { AxiosError } from 'axios'
import { Toast } from 'antd-mobile'
import { getToken, setToken } from './storage'
import history from './history'
import store from '@/store'
import { logout } from '@/store/actions/login'
import { ApiResponse, Token } from '@/types/data'
const instance = axios.create({
  baseURL: process.env.REACT_APP_BASE_URL,
  timeout: 5000,
})
// 添加请求拦截器
instance.interceptors.request.use(
  function (config) {
    // 在发送请求之前做些什么
    //配置一个token每次发送请求的时候发送token
    const { token } = getToken()
    if (token) {
      config.headers!.Authorization = `Bearer ${token}`
    }
    return config
  },
  function (error) {
    // 对请求错误做些什么
    return Promise.reject(error)
  }
)

// 添加响应拦截器
instance.interceptors.response.use(
  function (response) {
    // 对响应数据做点什么
    return response
  },
  async function (error: AxiosError<{ message: string }>) {
    // 对响应错误做点什么
    if (!error.response) {
      Toast.show({
        icon: 'loading',
        content: '服務器繁忙,請稍後重試',
      })
      return Promise.reject(error)
    }
    //判断响应的是不是401错误 判断是否是token的原因
    if (error.response.status === 401) {
      const token = getToken()
      //判斷是否有token token.token 且token.refresh_token也要有
      if (token.token && token.refresh_token) {
        //有token.token 且token.refresh_token 需要刷新token
        try {
          // const res = await axios.request({
          //   method: 'put',
          //   url: `${process.env.REACT_APP_BASE_URL}authorizations`,
          //   headers: {
          //     Authorization: `Bearer ${token.refresh_token}`,
          //   },
          // })
          const res = await axios.put<ApiResponse<Token>>(
            `${process.env.REACT_APP_BASE_URL}authorizations`,
            null,
            {
              headers: { Authorization: `Bearer ${token.refresh_token}` },
            }
          )
          //保存新的token到rudex中
          store.dispatch({
            type: 'login/login',
            payload: {
              token: res.data.data.token,
              refresh_token: token.refresh_token,
            },
          })
          //保存新的token到本地中
          setToken({
            token: res.data.data.token,
            refresh_token: token.refresh_token,
          })
          //打印的是錯誤的配置項 不過上面已經把錯誤更改為正確的配置項
          console.log(error.config)
          //跟新完刷新token重新發送請求 讓用戶毫無體驗
          return instance.request(error.config)
        } catch {
          //失敗走的邏輯
          //有token且refresh_token但是失效了
          //重新登錄
          store.dispatch(logout())
          history.replace('/login', { from: history.location.pathname })
        }
      } else {
        //沒有token token.token 或者沒有token.refresh_token
        //跳轉到登錄頁面
        history.replace('/login')
      }
    }
    //服务器正常返回但是接口报错了
    Toast.show({
      icon: 'fail',
      content: error.response.data.message,
    })
    return Promise.reject(error)
  }
)
export default instance
